SView for HTML5 V8.0集成说明书

SView for HTML5 控件提供三维模型基本的浏览、基本三维对象操作、动画播放、颜色设置等功能的实现接口，可实现基本的三维模型展示功能，以便于用户个性化定制属于自己的产品。

集成之前需要熟悉javascript、HTML语言及常用网页代码编辑软件，以便快速准确的集成相关功能界面。详细集成准备如下所示:

集成环境

SView for HTML5 开发库集成需要的环境：

开发环境：常用前端代码编辑器
系统环境: macOS、Linux、windows
运行环境: IE、edge、chorme、firefox等支持html5的浏览器

请按照下面步骤进行集成

具体步骤

首先将demo中./img/html5、js、css、zfile文件夹放入项目文件指定位置处。

在项目网页中引入css、js文件


						   <link href="css/bootstrap.css" rel="stylesheet" media="screen" >
<link href="css/common.css" rel="stylesheet">
<link href="css/zTreeStyle/zTreeStyle.css" rel="stylesheet" type="text/css">
<link href="css/meeting/grouppanel.css" rel="stylesheet">
<script src="js/Detector.js"></script>
<script src="js/CryptoJS.min.js"></script>
<script src="js/jquery-3.1.0.min.js" type="text/javascript"></script>
<script src="js/jquery.easyui.min.js" type="text/javascript"></script>
<script src="js/TweenMax.min.js" type="text/javascript"></script>
<script src="js/clipboard.min.js" type="text/javascript"></script>
<script src="js/sview/sview.min.js"></script>
<script src="js/bootstrap.min.js" type="text/javascript"></script>
<script src="js/fingerprint2.js" type="text/javascript"></script>
<link href="css/sweetalert/alert.css" rel="stylesheet" type="text/css">
<link href="css/sweetalert/theme.css" rel="stylesheet" type="text/css">
<script src="js/sweetalert/alert.js" type="text/javascript"></script>
<script src="js/bootstrap-contextmenu.js"></script>//右键菜单
<script src="js/zTree/jquery.ztree.core-3.5.js"></script>
<script src="js/zTree/jquery.ztree.excheck-3.5.js"></script>
<script src="js/zTree/jquery.ztree.exedit-3.5.js"></script>
<script src="js/jszip/jszip.min.js"></script>
<script src="js/jszip/jszip-utils.min.js"></script>
<script src="js/html2canvas.js"></script>
<script src="js/nipplejs.min.js"></script>
<script src="js/colpick.js"></script>
<link href="css/colpick.css" rel="stylesheet" type="text/css">
<link href="images/logo.png" rel="shortcut icon" type="text/x-icon">
<script src="js/bootstrap-slider.js" type="text/javascript"></script>
<link href="css/bootstrap-slider.css" rel="stylesheet" type="text/css">
<link href="css/loading-style.css" rel="stylesheet" type="text/css">
<link href="css/sweetalert/sweetalert.css" rel="stylesheet" type="text/css">
<script src="js/sweetalert/sweetalert.js" type="text/javascript"></script>
<script src="js/im/tim-js.js" type="text/javascript"></script>
<script src="js/im/cos-js-sdk-v5.min.js" type="text/javascript"></script>
<script src="js/im/trtc.js" type="text/javascript"></script>

在脚本中执行sview默认对象的初始化，如下代码所示


    if (!Detector.webgl) {
    Detector.addGetWebGLMessage();
    }
    var sview0 = null;
    $(function() {
    sview0 = initSView("sview0");
    sview0.setParameter("ServerViewUrl", "http://service.sv3d.cn");
    sview0.setParameter("SViewAPIUrl", "http://service.sv3d.cn");
    sview0.setParameter("userId", "123");
    sview0.setParameter("fileId", "5e06569b-2b1f-4d5d-bd2f-ccdce4c6d536");
    sview0.setParameter("user", "游客");
    sview0.setParameter("userFileId", "");
    sview0.setParameter("uniqueId", "123");
    try {

    //打开多个文件
    //参数1多个svlx文件路径的集合。
    //中文时需增加服务端utf-8路径配置。
    //var ret = sview0.open(["models/24-09-01.u3d.svlx","models/24-09-01.u3d.svlx"]);

    //打开一个svlx文件
    //参数1  svlx文件路径。
    //参数2  svlx文件是否是本地文件
    //中文时需增加服务端utf-8路径配置。
    //var ret = sview0.open("models/24-09-01.u3d.svlx",true);

    //打开多个svlx文件,并有模型对应的唯一标识
    //参数1  svlx文件路径集合。
    //参数2  模型对应的唯一标识的集合,与路径一一对应
    //中文时需增加服务端utf-8路径配置。
    //var ret = sview0.open(["models/24-09-01.u3d.svlx","models/24-09-01.u3d.svlx"],["uuid1","uuid2"]);

    //打开一个或多个本地jsvl或者obj文件
    //参数1  jsvl或者obj模型路径,数组格式。
    //参数2  顶级模型名称
    //参数3  压缩包内模型格式
    //中文时需增加服务端utf-8路径配置,jsvl或者obj格式需要添加至压缩包内进行打开多个模型需添加至多个压缩包内。
    //var ret = sview0.open(["models/24-09-01.u3d.zip","models/24-09-01.u3d.zip"],"topAssemblyName","obj/jsvl");

    //打开一个jsvl或者obj文件
    //参数1  jsvl或者obj模型路径。
    //参数2  是否是本地文件
    //参数3  压缩包内的文件名,可能与压缩包名称不一致
    //参数4  压缩包内文件格式
    //中文时需增加服务端utf-8路径配置,jsvl或者obj格式需要添加至压缩包内进行打开。
    //var ret = sview0.open("models/24-09-01.u3d.zip",true,"24-09-01.u3d","obj/jsvl");

    if(!(ret==""||ret==undefined))
    {
    alert(ret);
    }
    } catch (e) {
    alert("无法正常打开，请检查原始模型是否正确或联系客服人员！");
    $("#jdzw").css("width", "100%");
    $("#jdz").html("无法正常打开，请检查原始模型是否正确或联系客服人员！");
    }
    });

根据api文档中接口所示，用js或jquery进行所需功能的调用即可。

找到mongoose-free-6.5.exe，运行此软件，开启web测试服务。
进入demo.html 页面
iframe标签嵌套使用说明，进入iframe_used.html